<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="../../js/jquery-2.2.3.min.js"></script>
		<link rel="stylesheet" href="../../css/foodMenu.css" />
	</head>

	<body>
		<div id="all">
			<div id="header">
				<a id="logoA" href="1homepage.html">
					<div id="logo"></div>
				</a>
				<div id="language">
					<span id="country">中国</span>
					<select name="" onchange="traditional(this)">
						<option value="Select Language">Select Language</option>
						<option value="English">English</option>
						<option value="Chinese">Chinese</option>
					</select>
					<span class="right">|</span>
					<a href="http://www.subway.com/en-us">进入全球官网</a>
				</div>
				<ul id="head">
					<a href="2news.html">
						<li>新闻动态<img src="../../img/menu_part.gif" /></li>
					</a>
					<a href="3foodMenu.html">
						<li id="down_text1"><span id="down_text11">美食与营养</span><img src="../../img/menu_part.gif" />
							<ul id="down_text">
								<a href="3foodMenu.html">
									<li>超值 Value</li>
								</a>
								<a href="3foodMenu.html">
									<li>经典 ClassIcs</li>
								</a>
								<a href="3foodMenu.html">
									<li>精选 Premlum</li>
								</a>
								<a href="3foodMenu.html">
									<li>低脂 Low Fat</li>
								</a>
								<a href="3foodMenu.html">
									<li>百味卷 Wrap</li>
								</a>
								<a href="3foodMenu.html">
									<li>沙拉 Salad</li>
								</a>
								<a href="3foodMenu.html">
									<li>聚餐服务 CaterIng</li>
								</a>
								<a href="3foodMenu.html">
									<li>饮料与小食 Drinks & Sldes</li>
								</a>
								<a href="3foodMenu.html">
									<li>早餐 BREAKFAST</li>
								</a>
								<a href="3foodMenu.html">
									<li>营养 NutritIon</li>
								</a>
								<a href="3foodMenu.html">
									<li>如何点餐 How TO Order</li>
								</a>
							</ul>
						</li>
					</a>
					<a href="4joinUs.html">
						<li>加盟流程<img src="../../img/menu_part.gif" /></li>
					</a>
					<a href="5aboutUs.html">
						<li>关于我们</li>
					</a>
					<a href="###" id="lastLi">
						<li>快餐店位置查询</li>
					</a>
				</ul>
			</div>
			<div id="contain">
				<div id="left">
					<div id="text">
						<h4>如何点餐</h4>
						<p>SUBWAY®赛百味快餐店推出多款不同口味的三明治、沙拉和配菜，供您选择。为了确保您每次用餐称心如意，我们总结出最科学的点餐方式。此方法包含多个步骤，但非常简单。如下所示：</p>
					</div>
					<div id="img"></div>
				</div>
				<div id="right">
					<ul id="myUl">
						<a href="###">
							<li class="li">超值 Value <span> > </span>
								<ul class="myUl1">
									<li>
										<a href="###">意大利香辣 Spicy</a>
									</li>
									<li>
										<a href="###">培根 B.L.T</a>
									</li>
									<li>
										<a href="###">火腿 Ham</a>
									</li>
									<li>
										<a href="###">新鲜蔬菜 Veggle Delity</a>
									</li>
								</ul>
							</li>
						</a>
						<a href="###">
							<li class="li">经典 Classice <span> > </span>
								<ul class="myUl1">
									<li>
										<a href="###">意大利经典 Italian B.M.T.™</a>
									</li>
									<li>
										<a href="###">意大利香肠 Italian Sausage</a>
									</li>
									<li>
										<a href="###">香烤鸡排 Roasted Chicken</a>
									</li>
									<li>
										<a href="###">火鸡胸 Turkey Breast</a>
									</li>
									<li>
										<a href="###">日式照烧鸡 Chicken Teriyaki</a>
									</li>
								</ul>
							</li>
						</a>
						<a href="###">
							<li class="li">精选 Premium <span> > </span>
								<ul class="myUl1">
									<li>
										<a href="###">金枪鱼 Tuna</a>
									</li>
									<li>
										<a href="###">香热奇士 Subway Melt</a>
									</li>
									<li>
										<a href="###">香烤牛肉 Roast Beef</a>
									</li>
									<li>
										<a href="###">奇士牛排 Steak & Cheese</a>
									</li>
									<li>
										<a href="###">百味俱乐部 Subway Club™</a>
									</li>
								</ul>
							</li>
						</a>
						<a href="###">
							<li class="li">低脂 Low Fat <span> > </span>
								<ul class="myUl1">
									<li>
										<a href="###">火腿 Ham</a>
									</li>
									<li>
										<a href="###">火鸡胸 Turkey Breast</a>
									</li>
									<li>
										<a href="###">香烤鸡排 Roasted Chicken</a>
									</li>
									<li>
										<a href="###">新鲜蔬菜 Veggle Delity</a>
									</li>
								</ul>
							</li>
						</a>
						<a href="###">
							<li class="li d">百味卷 Wrap </li>
						</a>
						<a href="###">
							<li class="li d">沙拉 Salad </li>
						</a>
						<a href="###">
							<li class="li">聚餐服务 Catering <span> > </span>
								<ul class="myUl1">
									<li>
										<a href="###">三明治拼盘 Sandwich Platter</a>
									</li>
									<li>
										<a href="###">甜饼拼盘 Cookie Platter</a>
									</li>
									<li>
										<a href="###">巨型三明治 Giant Sub</a>
									</li>
								</ul>
							</li>
						</a>
						<a href="###">
							<li class="li d">饮料和小食 Drinks & Sides </li>
						</a>
						<a href="###">
							<li class="li d">早餐 BRACKFAST </li>
						</a>
						<a href="###">
							<li class="li">营养 Nutrition <span> > </span>
								<ul class="myUl1">
									<li>
										<a href="###">营养问与答 FAQ</a>
									</li>
								</ul>
							</li>
						</a>
						<a href="###">
							<li class="li d">如何点餐 How To Order </li>
						</a>
					</ul>
				</div>
			</div>

			<div id="foot">
				<a href="6position.html"><img src="../../img/home-box-1_CN.jpg" /></a>
				<a href="3foodMenu.html"><img src="../../img/home-box-2_CN.jpg" /></a>
				<a href="2news.html"><img src="../../img/home-box-3_CN.jpg" /></a>
				<a id="footImg" href="http://weibo.com/"><img src="../../img/weibo_CN.jpg" /></a>
				<a id="footImg1" href="###"><img src="../../img/weixin_CN.jpg" /><img id="erWei" src="../../img/F446097651218DD6122798254106BDE6.png" /></a>
			</div>
			<p id="footer">
				<a href="###">主页 |</a>
				<a href="###">菜单/营养 |</a>
				<a href="###">如何加盟 |</a>
				<a href="###">关于我们 |</a>
				<a href="###">快餐店位置查询</a>
				<br />
				<a href="###">联系我们 |</a>
				<a href="###">使用条款 |</a>
				<a href="###">隐私权政策 |</a>
				<a href="###">SUBWAY Partners™</a>
			</p>
			<div id="footer1">
				<p>SUBWAY® is a Registered Trademark of Subway IP Inc.</p>
				<p>®2016 Subway IP Inc.</p>
			</div>
		</div>
	</body>
	<script>
		// 下拉菜单
		function select() {
			var down_text = document.getElementById("down_text1");
			var thisChildren = down_text.children;
			down_text.onmouseover = function() {
				thisChildren[1].style.display = "block";
			}
			down_text.onmouseout = function() {
				thisChildren[1].style.display = "none";
			}

		}

		// 二维码
		function erWeiMa() {
			$("#footImg1").hover(function() {
				$("#erWei").css({
					display: "block"
				})
			}, function() {
				$("#erWei").css({
					display: "none"
				})
			})
		}

		// 下边图触发变色
		function hover() {
			var footImg = document.querySelectorAll("#foot>a>img")
			$("#foot>a>img").eq(0).hover(function() {
				footImg[0].src = "../../img/0441C3D1C41D58A11581CF0B7C4E718D.jpg"
			}, function() {
				footImg[0].src = "../../img/home-box-1_CN.jpg";
			})
			$("#foot>a>img").eq(1).hover(function() {
				footImg[1].src = "../../img/F381A46663B3CB1495F9F23B9C5EB276.jpg"
			}, function() {
				footImg[1].src = "../../img/home-box-2_CN.jpg";
			})
			$("#foot>a>img").eq(2).hover(function() {
				footImg[2].src = "../../img/95EB54105742D4D767334A3B99569ADC.jpg"
			}, function() {
				footImg[2].src = "../../img/home-box-3_CN.jpg";
			})
			$("#foot>a>img").eq(3).hover(function() {
				footImg[3].src = "../../img/weibo_CN_hover副本.jpg"
			}, function() {
				footImg[3].src = "../../img/weibo_CN.jpg"
			})
			$("#foot>a>img").eq(4).hover(function() {
				footImg[4].src = "../../img/weixin_CN_hover副本.jpg"
			}, function() {
				footImg[4].src = "../../img/weixin_CN.jpg"
			})
		}
		
		// 下拉菜单动画
		function option() {
			$(".li").each(function(ind) {
				$(".li").eq(ind).on("click", function() {
					
					if($(this).children("ul").css("height") == "0px") {
						$(this).children("ul").animate({
							height:100
						},1000)
					}else{
						$(this).children("ul").animate({
							height:0
						},1000)
					}
				})
			})
		
		}
		
		// 下拉菜单换图
		function pic(){
			console.log($(".d"))
			var imgArr = ["url(../../img/howOrder/161.jpg)","url(../../img/howOrder/171.jpg)","url(../../img/howOrder/181.png)","url(../../img/howOrder/21.jpg)","url(../../img/howtoorder-7.jpg)"];
			$(".d").each(function(ind){
				$(".d").eq(ind).on("click",function(){
					$("#img").css("background",imgArr[ind])
					$("#img").css("background-size","100% 100%")
				})
			})
			$(".myUl1>li").on("click",function(){
				$("#img").css("background","url(../../img/howOrder/food.jpg)")
				$("#img").css("background-size","100% 100%")
			})
			
		}
		
		window.onload = function() {
			select();
			erWeiMa();
			hover();
			option();
			pic();
		}
	</script>

</html>